<template>
  <el-container style="height: calc(100% - 66px)">
    <el-aside width="auto" style="padding: 20px 0 20px 20px; height: 100%">
      <div class="ps-panel nav-left-menu main-menu" style="height: 100%">
        <div class="ps-panel-head">
          <i class="ps-panel-head-icon iconfont icon-link"></i>
          <span class="ps-panel-head-title">模型管理YY</span>
          <button
            type="button"
            class="iconfont icon-screen menuTensile ps-right"
            v-on:click="menuTensile"
          ></button>
        </div>

        <div class="ps-panel-body">
          <el-menu
            :default-active="$route.path"
            :router="true"
            class="el-menu-vertical"
            :collapse="isCollapse"
          >
            <!--模型管理-->
            <el-menu-item index="/model_manage/model_manage">
              <i class="iconfont icon-model" style="color: #f03d39"></i>
              <span slot="title">模型管理ZZ</span>
            </el-menu-item>
          </el-menu>
        </div>
      </div>
    </el-aside>
    <el-main>
      <router-view
        style="height: 100%; background-color: #fff; overflow: auto"
      ></router-view>
    </el-main>
  </el-container>
</template>

<script>
import $ from "jquery";

export default {
  name: "modelApp",
  data() {
    return {
      isCollapse: false,
      active: 1,
      dialogTableVisible: false,
    };
  },
  methods: {
    menuTensile: function () {
      // eslint-disable-next-line
      let $navMenu = $(".main-menu");
      // eslint-disable-next-line
      this.isCollapse === true
        ? ($($navMenu).css("width", "268px"),
          $($navMenu).find("span").eq(0).css("display", "block"),
          $($navMenu).find("i").eq(0).css("display", "block"))
        : ($($navMenu).css("width", "64px"),
          $($navMenu).find("span").eq(0).css("display", "none"),
          $($navMenu).find("i").eq(0).css("display", "none"));
      this.isCollapse = !this.isCollapse;
    },
    getIndex(index, num) {
      return num + "-" + index;
    },
  },
};
</script>
